<template>
  <div class="page-container">
    <card class="insure-card" title="申请记录" :showDivider="false" />
    <table-index class="insure-card-table" :table="table" @loadData="loadData">
      <template #areaName="{ record }">
        {{ record.provinceName + record.cityName + record.countyName || '-' }}
      </template>
    </table-index>
  </div>
</template>

<script setup>
  import { reactive, onMounted, ref } from 'vue'
  import { useTable } from '@/hooks/table'
  import { thirdServicePolymerList } from '@/api/finance/thirdPayment'
  import useNavigate from '@/hooks/useNavigate'

  const { navigateTo } = useNavigate()
  const queryParam = reactive({})
  const operateList = ref([])
  const table = useTable({
    dataList: operateList,
    columns: [
      { title: '商户主体类型', dataIndex: 'typeName', width: 180 },
      {
        title: '商户名称',
        dataIndex: 'epName',
        width: 180,
      },
      { title: '营业执照名称', dataIndex: 'licenseName', width: 180 },
      { title: '经营省市区', dataIndex: 'areaName', width: 180, slotName: 'areaName' },
      { title: '法人姓名', dataIndex: 'cardPersonName', width: 180 },
      { title: '账户类型', dataIndex: 'accountTypeName', width: 180 },
      { title: '结算方式', dataIndex: 'settleWayName', width: 180 },
      { title: '申请人', dataIndex: 'applyUserName', width: 180 },
      { title: '申请时间', dataIndex: 'applyTime', width: 180 },
    ],
    operates: [
      {
        label: '详情',
        permission: 'svms:value-added:third-payments:polymerisation:detail',
        method: (record) => {
          navigateTo(`/value-added/thirdPayment/aggregation/detail/${record.id}?tab=1`, `${record.epSimple}-详情`)
        },
      },
      {
        label: '修改',
        permission: 'svms:value-added:third-payments:polymerisation:edit',
        method: (record) => {
          navigateTo(`/value-added/thirdPayment/aggregation/apply/${record.id}`, `${record.epSimple}-修改`)
        },
      },
      {
        label: '操作记录',
        permission: 'svms:value-added:third-payments:polymerisation:operate',
        method: (record) => {
          navigateTo(`/value-added/thirdPayment/aggregation/detail/${record.id}?tab=2`, `${record.epSimple}-详情`)
        },
      },
    ],
    tableLoading: false,
    pagination: false,
  })

  onMounted(() => {
    queryParam.pageSize = 100
    queryParam.pageNumber = 1
    thirdServicePolymerList({ ...queryParam }).then((res) => {
      operateList.value = res.result?.data
    })
  })
</script>
<style scoped lang="less"></style>
